<template>
  <div>
    <!--栏目文章详情-->
    <a-card>
      <div style="text-align: right;">
        <a-icon type="close-circle" style="fontSize:20px" @click="close()" />
      </div>
      <div class="title">{{item.title}}</div>
      <div class="author">作者：{{item.author}} <span style="margin-left: 15px" v-if="!!item.publisher">发布：{{item.publisher}}</span>  <span style="margin-left: 15px">{{item.publishDate}}</span>
      </div>
      <a-divider style="margin: 10px 0 10px 0"/>
      <div v-if="item.type=='article' && item.content" v-html="item.content"></div>
      <div v-else-if="item.type=='file' && item.fileUrl">
        <j-upload v-model="fileList" :buttonVisible="false" :disabled="true" :showDownLoadBtn="false"/>
      </div>
      <div v-else-if="item.type=='url' && item.linkUrl"><a :href="item.linkUrl">{{item.linkUrl}}</a></div>
    </a-card>
    <!-- <eoa-cms-article-reader-modal ref="readerModal"></eoa-cms-article-reader-modal> -->
  </div>

</template>

<script>
import {getAction} from '@/api/manage'
import store from '@/store'
import EoaCmsArticleReaderModal from './EoaCmsArticleReaderModal'

export default {
  name: "EoaCmsArticleDetailModal",
  components: {EoaCmsArticleReaderModal},
  inject: ['closeCurrent'],
  data() {
    return {
      item: {},
      fileList: [],
      articleId: null
    }
  },
    watch:{
      '$route.params.id'(val){
        if (!val) return
        this.articleId = this.$route.params.id;
        this.findArticle()
      }
    },
    created() {
      this.articleId = this.$route.params.id;
      this.findArticle()
      //保存阅读信息
      // this.recordReader();
    },
    methods: {
      recordReader(){
        if(this.item.id && store.getters.userInfo.username){
          getAction("/api/erpmng/eoa/cms/eoaCmsArticleRead/recordReader", {
            articleId: this.item.id,
            username: store.getters.userInfo.username
          }).then((res) => {
            if (res.success) {
              this.item.readTimes = this.item.readTimes + 1
            }
          });
        }else{
          if(!this.item.id){
            this.$message.warning("文章信息异常");
          }else{
            this.$message.warning("登录信息异常");
          }
        }
      },
      findArticle() {
        const that = this
        const id = this.articleId
        getAction("/api/erp/workbench/article/eoaCmsArticle/queryById", { id }).then((res) => {
          if(res.success){
            that.item = res.result
            if(res.result.fileUrl){
              this.fileList = res.result.fileUrl
            }
          }
        })
      },
      eyeClick(item){
        this.$refs.readerModal.loadReader(item);
      },
      close(){
        this.closeCurrent();
      }
    }
  }
</script>

<style lang="less" scoped>
  .title{
    text-align: center;
    font-size: 30px;
    font-weight: 600;
  }
  .author{
    font-size:12px;
    margin-left: 50px;
    text-align: left;
  }
</style>